<div class="row" ng-show="error">
	<div class="col-lg-12">
		<div class="alert alert-danger" ng-bind="error"></div>
	</div>
</div>
<form class="form-horizontal">
	<div class="form-group">
		<label class="col-sm-2 control-label">start date</label>
		<div class="col-sm-6">
			<input type="text" class="form-control" ng-model="start" ng-change="change()">
			<p class="help-block">Format: yyyy-mm-dd HH:MM[:SS] [MST/-0700]. UTC if no timezone. Uses now if blank.</p>
		</div>
	</div>
	<div class="form-group">
		<label class="col-sm-2 control-label">end date</label>
		<div class="col-sm-6">
			<input type="text" class="form-control" ng-model="end" ng-change="change()">
		</div>
	</div>
	<div class="form-group">
		<label class="col-sm-2 control-label">duration</label>
		<div class="col-sm-6">
			<input type="text" class="form-control" ng-model="duration" ng-change="change()">
			<p class="help-block">Specify either end date or <a href="http://opentsdb.net/docs/build/html/user_guide/query/dates.html#relative">duration</a>.</p>
		</div>
	</div>
	<div class="form-group">
		<label class="col-sm-2 control-label">alert</label>
		<div class="col-sm-10">
			<input type="text" class="form-control" ng-model="alert" ng-change="change()">
			<p class="help-block">Optional.</p>
		</div>
	</div>
	<div class="form-group">
		<label class="col-sm-2 control-label">hosts</label>
		<div class="col-sm-10">
			<input type="text" class="form-control" ng-model="hosts" ng-change="change()">
			<p class="help-block">Optional. Globs, separated by commas (,), pipes (|), or spaces. Example: <code>ny-web01, ny-redis*</code>.</p>
		</div>
	</div>
	<div class="form-group">
		<label class="col-sm-2 control-label">other tags</label>
		<div class="col-sm-10">
			<input type="text" class="form-control" ng-model="tags" ng-change="change()">
			<p class="help-block">Optional. Ex: port=637?,cluster=1,iface=lo*|if*. tagvs are <a href="http://golang.org/pkg/path/filepath/#Match">globs</a>, separated by pipes (|). Example: <code>port=637?</code>.</p>
		</div>
	</div>
	<div class="form-group">
		<label class="col-sm-2 control-label">username</label>
		<div class="col-sm-6">
			<username-input></username-input>
		</div>
	</div>
	<div class="form-group">
		<label class="col-sm-2 control-label">message</label>
		<div class="col-sm-10">
			<input type="text" class="form-control" ng-model="message">
		</div>
	</div>
	<div class="form-group">
		<div class="col-sm-offset-2 col-sm-10">
			<div class="checkbox">
				<label>
					<input type="checkbox" ng-model="forget" ng-change="change()"> Auto forget
				</label>
			</div>
			<p class="help-block">If the alert becomes unknown during the silence period, automatically forget it.</p>
		</div>
	</div>
	<div class="form-group">
		<div class="col-sm-offset-2 col-sm-6">
			<button class="btn btn-default" ng-click="test()">test</button>
		</div>
	</div>
</form>
<div class="row" ng-show="testSilences">
	<div class="col-sm-12">
		<h2>Will be silenced</h2>
	</div>
	<div class="col-sm-12">
		<ul class="list-unstyled">
			<li ng-repeat="(silence, active) in testSilences">
				<span ng-bind="silence"></span>
				<span class="label label-primary" ng-show="active">active</span>
			</li>
		<ul>
	</div>
	<div class="col-sm-12">
		<button class="btn btn-primary" ng-click="confirm()" ng-disabled="disableConfirm">confirm</button>
		<span ng-show="edit" class="label label-warning">editing rule {{edit}}</span>
	</div>
</div>

<div class="row">
	<div class="col-lg-12">
		<h2>Existing Silences</h2>
	</div>
</div>
<div class="row" ng-repeat="silence in silences">
	<div class="col-sm-12">
		<h3 ng-bind="silence.name"></h3>
		<table class="table" ts-table-sort="[[1,1]]">
			<thead>
				<tr>
					<th>start</th>
					<th>end</th>
					<th>alert</th>
					<th>tags</th>
					<th>user</th>
					<th>message</th>
					<th>edit</th>
				</tr>
			</thead>
			<tbody>
				<tr ng-repeat="(id, s) in silence.silences">
					<td ts-time="s.Start"></td>
					<td ts-time="s.End"></td>
					<td ng-bind="s.Alert"></td>
					<td ng-bind="s.TagString"></td>
					<td ng-bind="s.User"></td>
					<td ng-bind="s.Message"></td>
					<td>
						<a class="btn btn-primary btn-xs" ng-href="{{getEditSilenceLink(s, id)}}">edit</a>
						<button class="btn btn-danger btn-xs" ng-click="clear(id)">clear</button>
					</td>
				</tr>
			</tbody>
		</table>
	</div>
</div>